<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div class="panel panel-default">
    <div class="panel-heading">
        <h3>角色管理</h3>
    </div>
    <div class="panel-body" style="min-height: 500px">
        <div class="well">
            <button class="btn btn-danger" ng-click="newRole()">
                <i class="fa fa-plus"></i> 新建角色
            </button>
        </div>
        <table class="table table-bordered table-hover text-center">
            <thead>
                <td width="5%">id</td>
                <td width="50%">名字</td>
                <td>操作</td>
            </thead>
            <tbody>
                <tr ng-repeat="role in roleArray">
                    <td>{{role.id}}</td>
                    <td>{{role.name}}</td>
                    <td>
                        <button class="btn btn-primary"
                                ng-click="addUser(role)">
                            添加成员
                        </button>
                        <button class="btn btn-primary"
                                ng-click="changePermission(role)">
                            修改权限
                        </button>
                        <button class="btn btn-primary"
                                ng-click="editRole(role)">
                            修改名称
                        </button>
                        <button class="btn btn-danger"
                                ng-click="deleteRole(role)">
                            删除
                        </button>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

<div class="modal fade" id="newRoleDialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4>创建角色</h4>
    </div>
    <div class="modal-body">
        <div class="form-group">
            <label>
                角色名称
            </label>
            <input class="form-control" placeholder="请输入角色名称" ng-model="newRoleName">
        </div>
    </div>
    <div class="modal-footer">
        <button type="button" data-dismiss="modal" class="btn btn-danger">关闭</button>
        <button type="button"
                data-dismiss="modal"
                class="btn btn-primary"
                ng-click="doNewRole()">
            创建
        </button>
    </div>
</div>

<div class="modal fade" id="editRoleDialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4>修改角色</h4>
    </div>
    <div class="modal-body">
        <div class="form-group">
            <label>
                角色名称
            </label>
            <input class="form-control" ng-model="editRoleName">
        </div>
    </div>
    <div class="modal-footer">
        <button type="button" data-dismiss="modal" class="btn btn-danger">关闭</button>
        <button type="button"
                data-dismiss="modal"
                class="btn btn-primary"
                ng-click="changeRoleName()">
            修改
        </button>
    </div>
</div>

<div class="modal fade" id="addUserDialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4>添加成员</h4>
    </div>
    <div class="modal-body">
        <div class="well well-sm" ng-repeat="delegate in delegateList">
            <h4>
                <input type="checkbox"
                       name="cb_addUser"
                       ng-checked="delegate.role.id == onAddUserRole.id"
                       ng-value="delegate.id">
                {{delegate.name}}&nbsp;({{delegate.id}})-{{delegate.department.name}}
            </h4>
        </div>
    </div>
    <div class="modal-footer">
        <button type="button" data-dismiss="modal" class="btn btn-danger">关闭</button>
        <button type="button"
                data-dismiss="modal"
                class="btn btn-primary"
                ng-click="doAddUser()">
            修改
        </button>
    </div>
</div>

<div class="modal fade" id="setupPermissionDialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4>角色{{onCheckingRole.name}}-修改权限</h4>
    </div>
    <div class="modal-body">
        <ul id="permissionTree" class="ztree"></ul>
    </div>
    <div class="modal-footer">
        <button type="button" data-dismiss="modal" class="btn btn-danger">关闭</button>
        <button type="button"
                data-dismiss="modal"
                class="btn btn-primary"
                ng-click="doChangePermission()">
            确定
        </button>
    </div>
</div>